uid |
---|
NetCode.StrongTypedCode.RazorTypedModels |
In 2sxc 17+ you can use strong-typed models in your Razor files.
You will often split your code into multiple Razor files and pass parameters to child components:
flowchart LR
CS[Entry Razor\nList.cshtml] -->|📤Flexible Parameters| XD
XD["Child Razor\nList-Item.cshtml"]
The caller List.cshtml
usually does this:
@Html.Partial("List-Item.cshtml", new { Title = "Something", Product = product })
The child component List-Item.cshtml
would then pick this up with differing syntaxes - here's a RazorTyped
example:
@inherits Custom.Hybrid.RazorTyped
@{
var title = MyModel.String("Title");
var product = MyModel.Item("Product");
}
This is great, and ideal for flexible scenarios.
But we wanted to introduce more type safety, so we created the RazorTyped<TModel>
base class.
flowchart LR
CS[Entry Razor\nList.cshtml] -->|📤String Parameter| XD
XD["Child Razor\nList-Item.cshtml"]
The caller List.cshtml
would now do this:
@Html.Partial("List-Item.cshtml", "Something")
The child component List-Item.cshtml
would then pick this up with differing syntaxes - here's a RazorTyped
example:
@inherits Custom.Hybrid.RazorTyped<string>
@{
var title = Model;
}
Note that MyModel
still exists, but isn't made to handle single values.
But the Model
variable is what is typed with the RazorTyped<string>
.
flowchart LR
CS[Entry Razor\nList.cshtml] -->|📤Product| XD
XD["Child Razor\nList-Item.cshtml"]
The caller List.cshtml
would now do this:
@Html.Partial("List-Item.cshtml", product)
The child component List-Item.cshtml
would then pick this up with differing syntaxes - here's a RazorTyped
example:
@inherits Custom.Hybrid.RazorTyped<Product>
@{
var product = Model;
}
flowchart LR
CS[Entry Razor\nList.cshtml] -->|📤Product View Model| XD
XD["Child Razor\nList-Item.cshtml"]
You would now have another class /AppCode/Razor/ProductViewModel
which would be a strong-typed model.
namespace AppCode.Razor
{
public class ProductViewModel {
public string Title { get; set; }
public Product Product { get; set; }
}
}
The caller List.cshtml
would now do this:
@Html.Partial("List-Item.cshtml", new ProductViewModel { Title = "Something", Product = product })
The child component List-Item.cshtml
would then pick this up with differing syntaxes - here's a RazorTyped
example:
@inherits Custom.Hybrid.RazorTyped<ProductViewModel>
@using AppCode.Razor
@{
var title = Model.Title;
var product = Model.Product;
}
This new feature is great, but it's not for everyone. It takes a bit more work, but introduces type safety and IntelliSense to your Razor files. It also plays well with the new Razor Base Classes.
- Introduced in v17.03